<template>
    <div class="platform-page page">
        <img width="100%" src="/images/coach_training_banner.jpg"/>
        <div class="content">
            <PlatformCrumb back="返回" style="margin-top: 0;">
            </PlatformCrumb>
            <div class="content event-detail">
                <div class="qy_detailbody">
                    <div class="qy_detailbodytitle">
                        <span>基本资料</span>
                    </div>
                    <div class="qy_detailbody1">
                        <img class="qiuyuanimg" :src="detail.imgs|filtersImg" alt="">
                        <div class="qy_detailbody1z">
                            <el-form ref="form" :model="form" label-width="120px">
                                <el-row :gutter="20">
                                    <el-col :span="12">
                                        <el-form-item label="姓名">
                                            <p>{{detail.name}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="等级">
                                            <p>{{detail.coachLevel}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="学历">
                                            <p>{{detail.xlName}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="证件号码">
                                            <p>{{detail.证件号码}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="毕业院校">
                                            <p>{{detail.graduatedFrom}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="联系地址">
                                            <p>{{detail.address}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="联系电话">
                                            <p>{{detail.phone}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="语言能力">
                                            <p>{{detail.yy}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="微信">
                                            <p>{{detail.weChatNo}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="鞋码">
                                            <p>{{detail.shoeSize}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="邮箱">
                                            <p>{{detail.mail}}</p>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="所属足协">
                                            <p>{{detail.football}}</p>
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                            </el-form>

                        </div>
                    </div>
                    <div class="qy_detailbodytitle">
                        <span>证书</span>
                    </div>
                    <div class="zhengshulist">

                    </div>
                    <div class="qxqy">
                        <span>旗下球员 ({{total}})</span>
                    </div>
                    <div class="table">
                        <el-table
                                :header-cell-style="{background:'#F7F7F7',color:'#333333'}"
                                ref="multipleTable"
                                :data="list"
                                stripe
                                tooltip-effect="dark"
                                style="width: 100%"
                        >
                            <el-table-column align="center" label="序号" type="index" width="120">
                                <!--                        <template slot-scope="scope">-->
                                <!--                            {{ scope.row.date }}-->
                                <!--                        </template>-->
                            </el-table-column>
                            <el-table-column align="left" prop="name" label="用户名" width="120">
                                <!--插入图片链接的代码-->
                                <template slot-scope="scope">
                                    <img
                                            :src="scope.row.imgs|filtersImg"
                                            alt
                                            style="width: 36px;height: 36px;margin:1px;border:1px solid #BBBDBF;vertical-align: middle;"
                                    >
                                    {{ scope.row.name }}
                                </template>
                            </el-table-column>
                            <el-table-column align="center" type="index" label="序号"
                                             show-overflow-tooltip></el-table-column>
                            <el-table-column align="center" prop="age" label="年龄"
                                             show-overflow-tooltip></el-table-column>
                            <el-table-column align="center" prop="number" label="号码"
                                             show-overflow-tooltip></el-table-column>
                            <el-table-column align="center" prop="goodLocation" label="擅长位置"
                                             show-overflow-tooltip></el-table-column>
                            <el-table-column align="center" prop="sumScoure" label="综合能力"
                                             show-overflow-tooltip></el-table-column>
                            <el-table-column align="center" prop="count" label="课程"
                                             show-overflow-tooltip></el-table-column>
                            <el-table-column align="center" prop="grouping" label="分组"
                                             show-overflow-tooltip></el-table-column>
                            <el-table-column align="center" prop="wound" label="伤病备注"
                                             show-overflow-tooltip>
                                <template slot-scope="scope">
                                    <span style="color: red">{{ scope.row.wound }}</span>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" prop="opera" label="操作" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    <el-button @click="handleClick(scope.row.type,scope.row.statusId)" type="text"
                                               size="small">
                                        查看详情
                                    </el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                        <div class="pagination">
                            <el-pagination

                                    @current-change="handleCurrentChange"
                                    background :page-size="page.pageSize" layout="total, prev, pager, next"
                                    :total="total"
                            ></el-pagination>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    import PlatformCrumb from "@/components/PlatformCrumb.vue";
    import {getDetail, coachgetMyInfo, coachfindList} from '../../api/api/platform.js';
    import {baseImgPath, basefile} from '@/config/env.js';

    export default {
        components: {
            PlatformCrumb
        },
        data() {
            return {
                id: this.$route.query.id,
                data: {
                    id: this.$route.query.id
                },
                isshow: false,
                detail: {
                    address: "jiaolian",
                    beGoodAt: "jiaoxue",
                    certificate: "jiaoxue",
                    certificateName: "jiaoxue",
                    certificateNo: null,
                    coachLevel: 0,
                    coachLevelName: null,
                    dx: 0,
                    elseCertificate: "string",
                    football: "string",
                    graduatedFrom: "string",
                    id: 4,
                    imgs: null,
                    leaderNo: "string",
                    mail: "string",
                    mechanismId: 0,
                    mechanismName: null,
                    motto: null,
                    name: "jiaolian",
                    phone: "10000",
                    position: null,
                    rank: "0",
                    resumes: [],
                    shoeSize: "40",
                    ts: 0,
                    userId: 26,
                    weChatNo: "string",
                    xl: 0,
                    xlName: null,
                    yy: "string",
                    yyName: null,
                },
                page: {
                    "coachId": this.$route.query.id,
                    "pageNum": 1,
                    "pageSize": 10
                },
                list: [],
                total: 0,
            };
        },
        created() {
            this.getDetail()
            this.getList()
        },
        methods: {
            // 列表分页
            handleCurrentChange(val) {
                this.page.pageNum = val
                this.getList()
            },
            // 增加
            goAdd() {
                var that = this;
                that.$router.push({
                    path: '/platform/matchEdit',
                })
            },
            show_fun() {
                this.isshow = !this.isshow
            },
            // 详情
            getDetail() {
                var that = this;
                coachgetMyInfo(this.data).then(res => {
                    console.log(res);
                    if (res.code == 200) {
                        that.detail = res.data
                    }
                });
            },
            // 列表
            getList() {
                var that = this;
                coachfindList(this.data).then(res => {
                    console.log(res);
                    if (res.code == 200) {
                        that.list = res.data.list
                        that.total = res.data.total
                    }
                });
            },
        },
        filters: {
            filtersImg: function (img) {
                return basefile + img
            },
        },
    };
</script>

<style lang="less" scoped>
    @import url("platform.less");

    .operation {
        margin-right: 25px;
    }
</style>
